<template>
    <h1>VUE3.0学习</h1>
    <div class = "test1">
        <p>姓名：{{ name }}</p>
        <p>年龄：{{ age }}</p>
        <p>电话：{{ phone }}</p>
    </div>
</template>

<script lang="ts" setup>
    let name = '张三'
    let age = 18
    let phone = '13111111111'
</script>

<style scoped>
 .test1{
    font-size: 20px;
    color: blue;
    background-color: greenyellow;
    border: 2px solid #007bff; /* 设置边框的宽度和颜色 */
    border-radius: 20px; /* 将四个角变成圆形 */
    width: auto; /* 设置元素的宽度 */
    height: auto; /* 设置元素的高度 */

 }

</style>